<template>
	<el-container>
		<el-aside width="200px">
			<div class="logo-box">
				<img src="@/assets/img/logo.png" />
				<div><p>迪文ERP</p></div>
			</div>
			<vue-scroll :ops="ops_nav" class="vue_scroll">
				<el-menu :default-active="routePath" :default-openeds="openeds" @select="menuSelect" router unique-opened class="el_menu">
					<template v-for="item in menu">
						<el-submenu :index="item.url" v-if="item.children.length != 0">
							<template slot="title">
								<i :class="item.icon" class="icon"></i>
								<span>{{ item.name }}</span>
							</template>
							<template v-for="children in item.children">
								<el-submenu :index="children.url" v-if="children.children.length != 0">
									<template slot="title">
										<i :class="children.icon" class="icon"></i>
										<span>{{ children.name }}</span>
									</template>
									<el-menu-item :index="child.url" :key="child.id" v-for="child in children.children">{{ child.name }}</el-menu-item>
								</el-submenu>
								<el-menu-item :index="children.url" v-else>
									<i :class="children.icon" class="icon"></i>
									<span>{{ children.name }}</span>
								</el-menu-item>
							</template>
						</el-submenu>
						<el-menu-item :index="item.url" v-else>
							<i :class="item.icon" class="icon"></i>
							<span>{{ item.name }}</span>
						</el-menu-item>
					</template>
				</el-menu>
			</vue-scroll>
			<div class="copyright">
				<p>
					版权所有
					<br />
					北京迪文科技有限公司
				</p>
				<a href="http://www.beian.miit.gov.cn" target="_blank">京ICP备05033781号-5</a>
			</div>
		</el-aside>
		<el-container>
			<el-header>
				<div></div>
				<el-dropdown @command="userManage" trigger="click">
					<div class="user">
						<p>{{ username }}</p>
						<p>{{ real_name }}</p>
					</div>
					<el-dropdown-menu class="user_dropdown" slot="dropdown"><el-dropdown-item command="0">退出登录</el-dropdown-item></el-dropdown-menu>
				</el-dropdown>
			</el-header>
			<el-main>
				<div class="main"><router-view @pass="passNav" v-if="IsRouterAlive"></router-view></div>
			</el-main>
			<!-- <el-footer>Footer</el-footer> -->
		</el-container>
	</el-container>
</template>
<script>
export default {
	name: 'public',
	data() {
		return {
			username: this.$store?.store?.user?.username,
			real_name: this.$store?.store?.user?.real_name,
			menu: [],
			openeds: [],
			routePath: '',
			IsRouterAlive: true,
			ops_nav: {
				bar: {
					background: '#aaa',
					keepShow: true
				}
			},
			ops: {
				bar: {
					background: '#aaa',
					keepShow: true
				}
			}
		};
	},
	created() {
		/* try {
			this.username = this.$store.store.user.username;
		} catch (e) {
			this.$router.push({
				path: '/'
			});
			location.reload();
		} */
		this.GetMenu();
	},
	mounted() {
		$('.el_menu').css('max-height', $(window).height() - 70 - $('.copyright').height() - 40);
	},
	methods: {
		GetMenu() {
			this.menu = [
				// {
				// 	name: '客户业务列表',
				// 	icon: 'el-icon-s-data',
				// 	url: '/list',
				// 	children: []
				// },
				{
					name: '生产单管理',
					icon: 'el-icon-burger',
					url: '/material',
					children: []
				},
			];
			return;
			this.$api.GetMenus({}).then(data => {
				if (data.code == 0) {
				}
			});
		},
		passNav(navUrl) {
			this.routePath = navUrl;
			for (var i = 0; i < this.menu.length; i++) {
				if (navUrl == this.menu[i].url) {
					this.openeds = [];
					return false;
				}
				for (var j = 0; j < this.menu[i].children.length; j++) {
					if (navUrl == this.menu[i].children[j].url) {
						this.openeds = [this.menu[i].url];
						return false;
					}
				}
			}
		},
		menuSelect(key) {
			this.IsRouterAlive = false;
			this.$nextTick(function() {
				this.IsRouterAlive = true;
			});
		},
		userManage(command) {
			if (command == 0) {
				this.$router.push({
					path: '/'
				});
			}
		}
	},
	beforeDestroy() {}
};
</script>
<style lang="scss">
@import '~@/assets/css/element.scss';
@import '~@/assets/css/public.css';
@import '~@/assets/css/popup.css';
.vue_scroll {
	height: calc(100vh - 60px - 74px) !important;
}
</style>
